<template>
  <div class="main-content">
    <!-- <div class="filter-container">
      <el-input
        class="filter-item"
        v-model="getListData.usercode"
        placeholder="搜索方式"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>

      <el-input
        class="filter-item"
        v-model="getListData.name"
        placeholder="搜索发起方"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>

      <el-input
        class="filter-item"
        v-model="getListData.mobile"
        placeholder="业务员查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>

      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="客户号查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="区域查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="国家查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="终端销售区域查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="开发季节查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-input
        class="filter-item"
        v-model="getListData.email"
        placeholder="年份查询"
        clearable
        style="width: 200px; margin-left: 50px"
      ></el-input>
      <el-button
        size="medium"
        class="filter-item"
        type="primary"
        @click="getList"
        >查询</el-button
      >
      <el-button size="medium" class="filter-item" @click="resetSearch"
        >重置</el-button
      >
      <el-button size="medium" class="filter-item" @click="exportBeh"
        >导出搜花行为分析</el-button
      >
    </div> -->

    <p>搜索分析列表</p>
    <el-table :data="tableData" border>
      <el-table-column type="selection" width="50"> </el-table-column>
      <el-table-column type="index" label="ID" align="center">
      </el-table-column>
  
      <el-table-column
        prop="no"
        label="花型编号"
        width="150"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop=""
        label="搜索花型匹配度"
        width="150"
        align="center"
      >
      </el-table-column>

      <el-table-column prop="purpose" label="用途" width="150" align="center">
      </el-table-column>

      <el-table-column prop="design" label="款式" width="150" align="center">
      </el-table-column>

      <el-table-column
        prop="widthheight"
        label="幅宽(高对高)"
        width="150"
        align="center"
      >
      </el-table-column>

      <el-table-column
        prop="widthlow"
        label="幅宽(低对低)"
        width="150"
        align="center"
      >
      </el-table-column>

      <el-table-column prop="material_science" label="材料" width="150" align="center">
      </el-table-column>

      <el-table-column prop="elastic" label="弹性" width="150" align="center">
      </el-table-column>
      <el-table-column prop="wave_edge" label="波边" width="150" align="center">
      </el-table-column>

      <el-table-column prop="model" label="机型" width="150" align="center">
      </el-table-column>

      <el-table-column
        prop="radio_station"
        label="机台针数"
        width="150"
        align="center"
      >
      </el-table-column>

      <el-table-column prop="function" label="功能" width="150" align="center">
      </el-table-column>

      <el-table-column prop="style" label="风格" width="150" align="center">
      </el-table-column>

      <el-table-column prop="texture" label="质感" width="150" align="center">
      </el-table-column>

      <el-table-column prop="structure" label="结构" width="150" align="center">
      </el-table-column>

      <el-table-column
        prop="element"
        label="元素描述"
        width="150"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="series"
        label="花型系列"
        width="150"
        align="center"
      >
      </el-table-column>
    </el-table>

    <!-- <pagination
      style="text-align: right"
      v-show="totalPage > 0"
      :total="totalPage"
      :page.sync="getListData.pageNo"
      :limit.sync="getListData.pageSize"
      @pagination="getList"
    ></pagination> -->
  </div>
</template>

<script>
import { Message } from "element-ui";
import { patternList } from "@/app/api/analysis";
import { mapState } from "vuex";
import Pagination from "@/app/components/Pagination";

export default {
  components: {
    Pagination,
  },
  name: "Outcome",
  data() {
    return {
      importVisible: false,
      loading: false,
      tableData: [],
      totalPage: 1,
      listLoading: true,
      getListData: {
        pageNo: 1,
        pageSize: 10,
        pids:[]
      },
      dialogVisible: false,
      form: {},
      // dialogStatus: "", //编辑或新增
      // textMap: {
      //   update: "编辑",
      //   create: "新增",
      // },
      baseurl: api_url,
      pids:""
    };
  },
  computed: {
    ...mapState("user", ["session", "account"]),
  },
  created() {
    this.pids = this.$route.params.pids;
    this.getListData.pids = this.pids.split(",")
    this.getList();
  },
  methods: {
    getList() {
      patternList(this.getListData)
        .then((res) => {

          Object.keys(res.data).map((i)=>{ 
          
            this.tableData.push(res.data[i]);
           })
          // this.tableData = res.data;
          // this.totalPage = res.data.count;
          console.log(this.tableData);
          this.listLoading = false;
        })
        .catch((error) => {
          console.log("studentSourceList error", error);
        });
    },
    resetSearch() {
      this.getListData.created = [];
      this.getListData.name = "";
      this.getListData.usercode = "";
      this.getListData.mobile = "";
      this.getListData.email = "";
      this.getList();
    },
    exportBeh() {
      this.downloadLoading = true;
      exportHistory(this.getListData)
        .then((res) => {
          this.downloadLoading = false;
          window.location.href = this.baseurl + "/" + res.data.path;
        })
        .catch((err) => {
          this.downloadLoading = false;
        });
    },
    // deleteRow(oid) {
    //   organizeDelete({ oid })
    //     .then((res) => {
    //       if (res.code == "00000") {
    //         Message({
    //           message: "删除成功",
    //           type: "success",
    //           duration: 5 * 1000,
    //         });
    //         this.getList();
    //       }
    //     })
    //     .catch((error) => {
    //       console.log("save error", error);
    //     });
    // },
    // handleCreate() {
    //   this.form = {
    //     usercode: "",
    //     username: "",
    //     email: "",
    //     mobile: "",
    //     department: "",
    //     organization: "",
    //     position: "",
    //     valid: "",
    //     role_id: "",
    //     ascription: "",
    //   };
    //   this.dialogStatus = "create";
    //   this.dialogVisible = true;
    //   this.$nextTick(() => {
    //     this.$refs["acForm"].clearValidate();
    //   });
    // },
    // updateData(id) {
    //   this.$refs["acForm"].validate((valid) => {
    //     if (valid) {
    //       if (id) {
    //         this.form.id = id;
    //       }
    //       staffEdit(this.form)
    //         .then((res) => {
    //           if (res.code == "00000") {
    //             Message({
    //               message: "操作成功",
    //               type: "success",
    //               duration: 2 * 1000,
    //             });
    //             this.getList();
    //             this.dialogVisible = false;
    //           }
    //         })
    //         .catch((error) => {
    //           console.log("editOrder error", error);
    //         });
    //     } else {
    //       return false;
    //     }
    //   });
    // },
    // handleEdit(row) {
    //   this.form = Object.assign({}, this.form, row);
    //   console.log(this.form);
    //   this.dialogStatus = "update";
    //   this.dialogVisible = true;
    //   this.$nextTick(() => {
    //     this.$refs["acForm"].clearValidate();
    //   });
    // },
  },
};
</script>

<style>
</style>
